<template>
    <div>
        <span class="title">{{title}}</span>
        <el-icon :size="20">
            <Close @click="oncloseDlg" />
        </el-icon>
        <!-- <span class="close el-icon-close"
            @click="oncloseDlg"></span> -->
    </div>

</template>

<script setup>
import { ref } from 'vue'

const title = ref('一次变电设备')

//关闭整个界面的点击事件
const oncloseDlg = () => {
  console.log('关闭界面')
}
</script>

<style lang="scss">
.header {
  height: 30px;
  display: flex;
  flex-direction: row;
  border-bottom: 1px solid black;
  justify-content: flex-start;
  align-items: center;
  padding: 0 15px;

  .title {
    text-shadow: 0px 1px 0px #d8d8d8;
    line-height: 30px;
    text-align: left;
    flex: 1;
  }

  .close {
    line-height: 30px;
    cursor: pointer;
    // text-align: right;
    flex: 1;
  }
}
</style>